<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>JSDoc: Class: Easyrtc_App</title>

    <script src="scripts/prettify/prettify.js"> </script>
    <script src="scripts/prettify/lang-css.js"> </script>
    <!--[if lt IE 9]>
      <script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->
    <link type="text/css" rel="stylesheet" href="styles/prettify-tomorrow.css">
    <link type="text/css" rel="stylesheet" href="styles/jsdoc-default.css">
</head>

<body>

<div id="main">

    <h1 class="page-title">Class: Easyrtc_App</h1>

    




<section>

<header>
    
        <h2>Easyrtc_App</h2>
        
    
</header>

<article>
    <div class="container-overview">
    
        

    

    <h4 class="name" id="Easyrtc_App"><span class="type-signature"></span>new Easyrtc_App<span class="signature">()</span><span class="type-signature"></span></h4>

    



<div class="description">
    This file adds additional methods to Easyrtc for simplifying the 
management of video-mediastream assignment.
</div>













<dl class="details">

    

    

    

    

    

    

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="easyrtc_app.js.html">easyrtc_app.js</a>, <a href="easyrtc_app.js.html#line52">line 52</a>
    </li></ul></dd>
    

    

    

    
</dl>
















    
    </div>

    

    

    

     

    

    

    
        <h3 class="subsection-title">Methods</h3>

        
            

    

    <h4 class="name" id=".easyrtc.dontAddCloseButtons"><span class="type-signature">(static) </span>easyrtc.dontAddCloseButtons<span class="signature">()</span><span class="type-signature"></span></h4>

    



<div class="description">
    By default, the easyApp routine sticks a "close" button on top of each caller
video object that it manages. Call this function(before calling easyApp) to disable that particular feature.
</div>













<dl class="details">

    

    

    

    

    

    

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="easyrtc_app.js.html">easyrtc_app.js</a>, <a href="easyrtc_app.js.html#line68">line 68</a>
    </li></ul></dd>
    

    

    

    
</dl>















    <h5>Example</h5>
    
    <pre class="prettyprint"><code>easyrtc.dontAddCloseButtons();</code></pre>



        
            

    

    <h4 class="name" id=".easyrtc.easyApp"><span class="type-signature">(static) </span>easyrtc.easyApp<span class="signature">(applicationName, monitorVideoId, videoIds, onReady, onFailure)</span><span class="type-signature"></span></h4>

    



<div class="description">
    Provides a layer on top of the easyrtc.initMediaSource and easyrtc.connect, assign the local media stream to
the video object identified by monitorVideoId, assign remote video streams to
the video objects identified by videoIds, and then call onReady. One of it's
side effects is to add hangup buttons to the remote video objects, buttons
that only appear when you hover over them with the mouse cursor. This method will also add the
easyrtcMirror class to the monitor video object so that it behaves like a mirror.
</div>









    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>applicationName</code></td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            

            

            <td class="description last">name of the application.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>monitorVideoId</code></td>
            

            <td class="type">
            
                
<span class="param-type">String</span>


            
            </td>

            

            

            <td class="description last">the id of the video object used for monitoring the local stream.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>videoIds</code></td>
            

            <td class="type">
            
                
<span class="param-type">Array</span>


            
            </td>

            

            

            <td class="description last">an array of video object ids (strings)</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>onReady</code></td>
            

            <td class="type">
            
                
<span class="param-type">function</span>


            
            </td>

            

            

            <td class="description last">a callback function used on success. It is called with the easyrtcId this peer is known to the server as.</td>
        </tr>

    

        <tr>
            
                <td class="name"><code>onFailure</code></td>
            

            <td class="type">
            
                
<span class="param-type">function</span>


            
            </td>

            

            

            <td class="description last">a callback function used on failure (failed to get local media or a connection of the signaling server).</td>
        </tr>

    
    </tbody>
</table>






<dl class="details">

    

    

    

    

    

    

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="easyrtc_app.js.html">easyrtc_app.js</a>, <a href="easyrtc_app.js.html#line374">line 374</a>
    </li></ul></dd>
    

    

    

    
</dl>















    <h5>Example</h5>
    
    <pre class="prettyprint"><code>easyrtc.easyApp('multiChat', 'selfVideo', ['remote1', 'remote2', 'remote3'],
             function(easyrtcId){
                 console.log("successfully connected, I am " + easyrtcId);
             },
             function(errorCode, errorText){
                 console.log(errorText);
             });</code></pre>



        
            

    

    <h4 class="name" id=".easyrtc.getIthCaller"><span class="type-signature">(static) </span>easyrtc.getIthCaller<span class="signature">(i)</span><span class="type-signature"> &rarr; {String}</span></h4>

    



<div class="description">
    Get the easyrtcid of the ith caller, starting at 0.
</div>









    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>i</code></td>
            

            <td class="type">
            
                
<span class="param-type">number</span>


            
            </td>

            

            

            <td class="description last"></td>
        </tr>

    
    </tbody>
</table>






<dl class="details">

    

    

    

    

    

    

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="easyrtc_app.js.html">easyrtc_app.js</a>, <a href="easyrtc_app.js.html#line215">line 215</a>
    </li></ul></dd>
    

    

    

    
</dl>













<h5>Returns:</h5>

        


<dl>
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">String</span>


    </dd>
</dl>

    



        
            

    

    <h4 class="name" id=".easyrtc.getSlotOfCaller"><span class="type-signature">(static) </span>easyrtc.getSlotOfCaller<span class="signature">(easyrtcid)</span><span class="type-signature"> &rarr; {number}</span></h4>

    



<div class="description">
    This is the complement of getIthCaller. Given an easyrtcid,
it determines which slot the easyrtc is in.
</div>









    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>easyrtcid</code></td>
            

            <td class="type">
            
                
<span class="param-type">string</span>


            
            </td>

            

            

            <td class="description last"></td>
        </tr>

    
    </tbody>
</table>






<dl class="details">

    

    

    

    

    

    

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="easyrtc_app.js.html">easyrtc_app.js</a>, <a href="easyrtc_app.js.html#line231">line 231</a>
    </li></ul></dd>
    

    

    

    
</dl>













<h5>Returns:</h5>

        
<div class="param-desc">
    or -1 if the easyrtcid is not a caller.
</div>



<dl>
    <dt>
        Type
    </dt>
    <dd>
        
<span class="param-type">number</span>


    </dd>
</dl>

    



        
            

    

    <h4 class="name" id=".easyrtc.setGotConnection"><span class="type-signature">(static) </span>easyrtc.setGotConnection<span class="signature">(gotConnectionCB)</span><span class="type-signature"></span></h4>

    



<div class="description">
    Sets an event handler that gets called when a connection to the signaling
server has or has not been made. Can only be called after calling easyrtc.easyApp.
</div>









    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>gotConnectionCB</code></td>
            

            <td class="type">
            
                
<span class="param-type">function</span>


            
            </td>

            

            

            <td class="description last">has the signature (gotConnection, errorText)</td>
        </tr>

    
    </tbody>
</table>






<dl class="details">

    

    

    

    

    

    

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="easyrtc_app.js.html">easyrtc_app.js</a>, <a href="easyrtc_app.js.html#line411">line 411</a>
    </li></ul></dd>
    

    

    

    
</dl>















    <h5>Example</h5>
    
    <pre class="prettyprint"><code>easyrtc.setGotConnection( function(gotConnection, errorText){
       if( gotConnection ){
           console.log("Successfully connected to signaling server");
       }
       else{
           console.log("Failed to connect to signaling server because: " + errorText);
       }
   });</code></pre>



        
            

    

    <h4 class="name" id=".easyrtc.setOnCall"><span class="type-signature">(static) </span>easyrtc.setOnCall<span class="signature">(cb)</span><span class="type-signature"></span></h4>

    



<div class="description">
    Sets an event handler that gets called when an incoming MediaStream is assigned 
to a video object. The name is poorly chosen and reflects a simpler era when you could
only have one media stream per peer connection.
</div>









    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>cb</code></td>
            

            <td class="type">
            
                
<span class="param-type">function</span>


            
            </td>

            

            

            <td class="description last">has the signature function(easyrtcid, slot){}</td>
        </tr>

    
    </tbody>
</table>






<dl class="details">

    

    

    

    

    

    

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="easyrtc_app.js.html">easyrtc_app.js</a>, <a href="easyrtc_app.js.html#line186">line 186</a>
    </li></ul></dd>
    

    

    

    
</dl>















    <h5>Example</h5>
    
    <pre class="prettyprint"><code>easyrtc.setOnCall( function(easyrtcid, slot){
     console.log("call with " + easyrtcid + "established");
  });</code></pre>



        
            

    

    <h4 class="name" id=".easyrtc.setOnHangup"><span class="type-signature">(static) </span>easyrtc.setOnHangup<span class="signature">(cb)</span><span class="type-signature"></span></h4>

    



<div class="description">
    Sets an event handler that gets called when a call is ended.
it's only purpose (so far) is to support transitions on video elements.
         x     * this function is only defined after easyrtc.easyApp is called.
The slot is parameter is the index into the array of video ids.
Note: if you call easyrtc.getConnectionCount() from inside your callback
it's count will reflect the number of connections before the hangup started.
</div>









    <h5>Parameters:</h5>
    

<table class="params">
    <thead>
    <tr>
        
        <th>Name</th>
        

        <th>Type</th>

        

        

        <th class="last">Description</th>
    </tr>
    </thead>

    <tbody>
    

        <tr>
            
                <td class="name"><code>cb</code></td>
            

            <td class="type">
            
                
<span class="param-type">function</span>


            
            </td>

            

            

            <td class="description last">has the signature function(easyrtcid, slot){}</td>
        </tr>

    
    </tbody>
</table>






<dl class="details">

    

    

    

    

    

    

    

    

    

    

    

    

    
    <dt class="tag-source">Source:</dt>
    <dd class="tag-source"><ul class="dummy"><li>
        <a href="easyrtc_app.js.html">easyrtc_app.js</a>, <a href="easyrtc_app.js.html#line204">line 204</a>
    </li></ul></dd>
    

    

    

    
</dl>















    <h5>Example</h5>
    
    <pre class="prettyprint"><code>easyrtc.setOnHangup( function(easyrtcid, slot){
     console.log("call with " + easyrtcid + "ended");
  });</code></pre>



        
    

    

    
</article>

</section>




</div>

<nav>
    <h2><a href="index.html">Home</a></h2><h3>Classes</h3><ul><li><a href="Easyrtc.html">Easyrtc</a></li><li><a href="Easyrtc_App.html">Easyrtc_App</a></li><li><a href="Easyrtc_IframeCapture.html">Easyrtc_IframeCapture</a></li><li><a href="Easyrtc_No_IframeCapture.html">Easyrtc_No_IframeCapture</a></li><li><a href="Easyrtc_Rates.html">Easyrtc_Rates</a></li><li><a href="Easyrtc_Recorder.html">Easyrtc_Recorder</a></li></ul>
</nav>

<br class="clear">

<footer>
    Documentation generated by <a href="https://github.com/jsdoc3/jsdoc">JSDoc 3.5.0-dev</a> on Wed Oct 12 2016 08:54:49 GMT-0700 (PDT)
</footer>

<script> prettyPrint(); </script>
<script src="scripts/linenumber.js"> </script>
</body>
</html>